//chatgpt: vue cdn 方式引入 elementui 的查询做成一个js组件，供其他页面引用这个js组件的示例

//直接引入（test.html） <script src="components/pagination2.js"></script>
Vue.component('Customizemenutree', {
    template: `
    <div v-for="(item, index) in sourceData" :key="index" >
    <el-submenu :key="item.id" :index="item.path" v-if="item.children" >
        <template slot="title">
            <i :class="item.icon"></i>
            <span slot="title"> {{ item.meta }}</span>
        </template>                        
                        
        <el-menu-item :index="cItem.path" v-for="(cItem, cIndex) in item.children" 
            :key="cItem.id" @click="saveRoutePath(cItem.path)">
            <i :class="cItem.icon"></i>
            <span slot="title">{{ cItem.meta }}</span>
        </el-menu-item>
    </el-submenu>

    <el-menu-item :index="item.path" v-else 
        :key="item.id" @click="saveRoutePath(item.path)">
        <i :class="item.icon"></i>
        <span slot="title"> {{ item.meta }}</span>
    </el-menu-item>
</div>`,
   
    data() {
        return {
            keyword: '',
            sourceData:[]
        };
    },
    methods: {
        handleQuery() {
            // 进行查询操作
            // 可以在这里发起请求或者触发一个自定义事件，将查询条件传递给父组件
            this.$emit('query', this.keyword);
        }
    }
});
